<template>
  <div class="pd30 produceFactory">
    <div class="panelWrap">
      <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
        <div>实时救援</div>
      </div>
      <div class="con">
        <div class="con-row flex flexac pl search-box">
          <div class="flex flexac">
            <el-input v-model.trim="roomValue" placeholder="请输入房间号" />
            <div class="con-row flex flexac flexjcsb pl">
              <el-button class="" type="primary" @click="handleToRoom">进入视频房间</el-button>
            </div>
          </div>
        </div>

        <el-table
          id="useplaceTable"
          ref="useplaceTable"
          class="con-table"
          type="expand"
          :data="realtime"
          highlight-current-row
        >

          <el-table-column label="图片" align="center" width="100">
            <template slot-scope="scope">
              <el-image :src="scope.row.url" />
            </template>
          </el-table-column>

          <template v-for="item in tablehead">
            <el-table-column v-if="item.isShow" :key="item.index" :width="item.width" align="center" :sortable="item.sortable" :show-overflow-tooltip="true" :prop="item.prop" :label="item.label" />
          </template>

          <el-table-column prop="name" label="基本操作" align="center">
            <template slot-scope="scope">
              <el-button class="defaultbtn" type="primary" plain size="mini" @click="handleEdit(scope.$index, scope.row)">
                <!-- <i class="el-icon-edit" /> -->
                邀 请</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'Realtime',
  components: {},
  props: {},
  data() {
    return {
      roomValue: '1234',
      realtime: [
        {
          id: 0,
          title: '救援人员',
          company: '',
          function: '',
          url: require('@/assets/wbgs.jpg'),
          date: '2020-01-12 11:10:20'
        },
        {
          id: 1,
          title: '维保专家',
          company: '',
          function: '',
          url: require('@/assets/jyzj.jpg'),
          date: '2020-01-12 11:10:20'
        },
        {
          id: 2,
          title: '物业人员',
          company: '',
          function: '',
          url: require('@/assets/sydw.jpg'),
          date: '2020-01-12 11:10:20'
        },
        {
          id: 3,
          title: '政府部门',
          company: '',
          function: '',
          url: require('@/assets/zfbm.jpg'),
          date: '2020-01-12 11:10:20'
        }

      ],
      tablehead: [
        {
          index: 0,
          prop: 'company',
          label: '参与单位',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 1,
          prop: 'title',
          label: '参与人',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 2,
          prop: 'date',
          label: '加入时间',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 3,
          prop: 'function',
          label: '功能',
          sortable: false,
          fixed: true,
          isShow: true
        }
      ]

    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.$storage.set('upUrl', JSON.stringify({ 'path': '/government/emergency/rescueCenter/realtime' }))
  },
  methods: {
    handleToRoom() {
      window.open('https://webrtc.linkpow.cn/room.html?id=1234', '_blank')
      '_blank'
    }
  }
}
</script>

<style scoped lang="scss">

</style>
